<!DOCTYPE html>
<html>

<head>
    <title>年会签到</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <!--<link type="text/css" href="bootstrap/css/bootstrap.min.css" rel="stylesheet"/>-->
    <!--签到-->
    <link type="text/css" href="/Public/libs/nianhui1/css/index.css" rel="stylesheet" />
    <link rel="stylesheet" href="/Public/libs/nianhui1/css/animate.min.css">
    <link type="text/css" href="/Public/libs/nianhui1/css/common.css" rel="stylesheet" />
    <script src="/Public/libs/nianhui1/js/jquery.min.js"></script>

    <!--抽奖-->
    <link type="text/css" href="/Public/libs/nianhui1/css/draw.css" rel="stylesheet" />
    <!-- <script type="text/javascript" src="/Public/libs/nianhui1/js/jquery.js"></script> -->

    <!--摇一摇-->
    <link type="text/css" href="/Public/libs/nianhui1/css/shake.css" rel="stylesheet" />
    <script type="text/javascript" src="/Public/libs/jrender.min.js"></script>
    <!--精彩瞬间-->
    <link rel="stylesheet" href="/Public/libs/nianhui1/css/style.css" />
    <link type="text/css" href="/Public/libs/nianhui1/css/wink.css" rel="stylesheet" />

    
    <script src="/Public/libs/store.legacy.min.js"></script>

</head>

<body>
    <!--<div class="all ">-->
    <!--<div class="topimg"></div>
        <div class="leftfu"></div>
        <div class="smallfu"></div>
        <div class="bigdl"></div>
        <div class="bigfu"></div>
        <div class="moddledl"></div>
        <div class="smalldl"></div>
        <div class="leftimg"></div>
        <div class="rightimg"></div>-->
    <!--签到-->
    <div id="qiandaoqiang" class="bgimg1">
        <script src="/Public/libs/nianhui1/js/three.js"></script>
        <script src="/Public/libs/nianhui1/js/tween.min.js"></script>
        <script src="/Public/libs/nianhui1/js/TrackballControls.js"></script>
        <script src="/Public/libs/nianhui1/js/CSS3DRenderer.js"></script>
        <!--<div class="centerimg">
                <h1>签到名单</h1>
            </div>-->
        <div class="topcenterfont">
            <h1>领飞集团2017年会盛宴</h1>
            <br />
            <h2>年/度/达/标&nbsp;&nbsp;&nbsp;奋/勇/向/前</h3>
        </div>
        <div id="container"></div>
        <div id="menu">
            <button id="table">表格</button>
            <button id="sphere">球球</button>
            <button id="helix">螺旋</button>
            <button id="grid">格子</button>
        </div>

        <div class="show_info animated" style="display: none;">
            <div class="info_my">
                <img src="/Public/libs/nianhui1/img/c.png" width="150" height="150" />
                <div class="info_mem">
                    <div class="nickname">smile的微笑</div>
                </div>
            </div>
        </div>
        <script src="/Public/libs/nianhui1/js/qiandao.js"></script>
    </div>


    <!--抽奖-->
    <div style="display: none;" id="choujiang" class="bgimg2">
    	<div class="audio" style="width:0; height:0px; overflow:hidden; text-indent:-999px;">
	        <audio id='audio' src='../../../../Public/libs/nianhui1/sound/3070.mp3' style="width:0; height:0px;"></audio>
	    </div>	
        <script type="text/javascript" src="/Public/libs/nianhui1/js/draw.js"></script>
        <div class="topcenterfont">
            <h1>抽奖活动</h1>
            <br />
            <h2>公/平/公/正&nbsp;&nbsp;&nbsp;签/到/抽/奖</h3>
        </div>
        <div class="wrap">
            <!--<img src="/Public/libs/nianhui1/img/1.png" class="dengimg" id="dengimg" />-->
            <div class="show" id="show">
                <!--点击空格键开始抽奖-->
                <div id="imgDiv">
                    <img src="../../../../Public/libs/nianhui1/image/kaishi.png" id="image" />      
                </div>
                <div id="zjrnc" style="display: none;" >
                	<span class="nicheng">微信名称：</span>
                	<span class="nicheng-box">qingqingzijin</span>
                </div>
            </div>
        </div>
        <canvas id="c" style="display: none;"></canvas>
        <script src="/Public/libs/nianhui1/js/yanhua2.js"></script>

    </div>


    <!--摇一摇-->
    <div style="display: none;" id="yaoyiyao" class="bgimg3">
        <!--<div class="centerimg" style="display: none;"></div>-->
        <div class="topcenterfont">
            <h1>摇一摇</h1>
            <br />
            <h2>摇一摇&nbsp;摇取神秘大奖</h3>
        </div>
        <div class="yaoyiyaodiv">
            <div class="ybgdiv">
                <img src="/Public/libs/nianhui1/img/shou.png" class="shouimg" />
                <img src="/Public/libs/nianhui1/img/waiyuan.png" class="waiimg" />
            </div>
            <svg viewBox="-500 -500 1000 1000" width="50%" height="100%" preserveAspectRatio="xMidYMin slice" style="display: none;"
                id="svg">
                <defs>
                    <filter id="goo">
                        <feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur"></feGaussianBlur>
                        <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 20 -5" result="goo"></feColorMatrix>
                        <feComposite in="SourceGraphic" in2="goo" operator="atop"></feComposite>
                    </filter>
                </defs>
                <circle fill="hsla(0, 100%, 50%, 0.25)" cx="0" cy="0" r="300"></circle>
                <g filter="url(#goo)">
                    <text x="0" y="150">10</text>
                    <text x="0" y="150">9</text>
                    <text x="0" y="150">8</text>
                    <text x="0" y="150">7</text>
                    <text x="0" y="150">6</text>
                    <text x="0" y="150">5</text>
                    <text x="0" y="150">4</text>
                    <text x="0" y="150">3</text>
                    <text x="0" y="150">2</text>
                    <text x="0" y="150">1</text>
                </g>
            </svg>
            <div style="display: none;" id="djsfont">猜猜看是谁</div>
        </div>
        <div class="lingjiang j-specCard-box" style="display: none;">
                <div class="lingjiantai">
                </div>
        </div>

        <script type="text/x-jsrender" id="j-specCard">

            <div class="lingjiantai">
                <%if return_body[0]%>
                <div class="champion">
                    <img class="personimg" src="<%:return_body[0]['userInfo']['user_headimgurl']%>" />
                    <span>第一名</span>
                    <br />
                    <span>次数：
                        <span class="shake-num">
                            <%:return_body[0]['shark_num']%>
                        </span>
                    </span>
                    <div style="overflow: hidden;text-overflow:ellipsis;white-space: nowrap;max-width:120px;">昵称: <%:return_body[0]['userInfo']['user_nickname']%></div>
                </div>
                <%/if%>
                <%if return_body[1]%>
                <div class="secondperson">
                    <img class="personimg" src="<%:return_body[1]['userInfo']['user_headimgurl']%>" />
                    <span>第二名</span>
                    <br />
                    <span>次数：
                        <span class="shake-num">
                            <%:return_body[1]['shark_num']%>
                        </span>
                    </span>
                    <div style="overflow: hidden;text-overflow:ellipsis;white-space: nowrap;max-width:120px;">昵称: <%:return_body[1]['userInfo']['user_nickname']%></div>
                </div>
                <%/if%>
                <%if return_body[2]%>
                <div class="thirdperson">
                    <img class="personimg" src="<%:return_body[2]['userInfo']['user_headimgurl']%>" />
                    <span>第三名</span>
                    <br />
                    <span>次数：
                        <span class="shake-num">
                            <%:return_body[2]['shark_num']%>
                        </span>
                    </span>
                    <div style="overflow: hidden;text-overflow:ellipsis;white-space: nowrap;max-width:120px;">昵称: <%:return_body[2]['userInfo']['user_nickname']%></div>
                </div>
                <%/if%>
            </div>

            <ul class="otherperson">
                <%for return_body%>
                    <%if #getIndex()>2%>
                        <li class="listyle">
                            <img src="<%:userInfo['user_headimgurl']%>" class="" />
                            <span>第
                                <%:#getIndex() + 1%>
                                    名</span>
                            <br />
                            <span>次数：
                                <%:shark_num%>
                            </span>
                        </li>
                        <%/if%>
                            <%/for%>
            </ul>

        </script>



    </div>


    <!--精彩瞬间-->
    <div id="shuanjian" class="bgimg4">
        <script src="/Public/libs/nianhui1/js/islider.js"></script>
        <script src="/Public/libs/nianhui1/js/plugins/islider_desktop.js"></script>
        <!--<div class="centerimg"></div>-->
        <div class="topcenterfont">
            <h1>领飞集团2017年会美丽瞬间</h1>
            <br />
            <h2>拍下最美的一瞬间</h3>
        </div>
        <div id="iSlider-effect-wrapper">
            <div id="animation-effect" class="iSlider-effect"></div>
        </div>
        <script>
            var picList = [{
                    width: 1000,
                    height: 700,
                    content: "/Public/libs/nianhui1/images/1.jpg",
                },
                {
                    width: 1000,
                    height: 400,
                    content: "/Public/libs/nianhui1/images/2.jpg",
                }
            ];

            //all animation effect
            var islider1 = new iSlider({
                data: picList,
                dom: document.getElementById("animation-effect"),
                duration: 2000,
                animateType: 'depth',
                isAutoplay: true,
                isLooping: true,
                // isVertical: true, 是否垂直滚动
            });
            islider1.bindMouse();

            // 获取最美瞬间
            $.ajax({
                type: 'POST',
                url: '/admin.php/Active/getuserimg',
                data: {
                    time: 666
                },
                success: function (data) {
                    if (data['return_code'] == 1) {
                        for (var i = 0; i < data['return_body'].length; i++) {

                            if (i < picList.length) {
                                picList[i]['content'] = 'http://wx.lovepai.ren' + data['return_body'][i]
                                    ['img_url'];
                            } else {
                                picList.push({
                                    width: 700,
                                    height: 400,
                                    content: data['return_body'][i]['img_url']
                                })
                            }

                        }
                    } else {
                        console.log(data['return_code']);
                    }

                },
                error: function (err) {

                }
            })
        </script>
    </div>
    <!--</div>-->
    <div class="control">
        <h1>控制台</h1>
        <div class="btndiv">
            <button id="qiandaobtn">签到</button>
            <button id="choujiangbtn">抽奖</button>
        </div>
        <div class="btndiv">
            <button id="yaoyiyaobtn">摇一摇</button>
            <button id="shuanjianbtn">瞬间</button>
        </div>
        <div class="third ystop">
            <span>摇一摇：</span>
            <button class="change-shark-flag-btn">开始</button>
        </div>
        <div class="third cstart">
            <span>抽奖：</span>
            <button id="choujiangstart">开始</button>
        </div>
    </div>
    <script>
        $(function () {

            $(".ystop").hide();
            $(".cstart").hide();
            $("#shuanjian").hide();
            
        })
        $("#qiandaobtn").click(function () {
            $("#qiandaoqiang").show();
            $("#choujiang").hide();
            $("#yaoyiyao").hide();
            $("#shuanjian").hide();
            $(".ystop").hide();
            $(".cstart").hide();
            var oAudio = document.getElementById('audio');
            oAudio.pause();
            //          $(".centerimg").show();
        });
        $("#choujiangbtn").click(function () {
            $("#qiandaoqiang").hide();
            //          clock();
            $("#choujiang").show();
            $("#yaoyiyao").hide();
            $("#shuanjian").hide();
            $(".ystop").hide();
            $(".cstart").show();
			$("#c").hide();
			$("#zjrnc").hide();
			$("#show").css({
    			"width":"660px",
    			"height":"500px",
    			"background":"url(../../../../Public/libs/nianhui1/img/choujiang1.png) no-repeat",
    			"background-size":"100%",
    			"line-height":"50px",
    			"text-align":"center",
    			"color":"#fff",
    			"font-size":"20px",
				"padding-top":"235px"
    		});
			$("#image").css({
				"width": "240px",
				"height": "191px",
				"border-radius":"0px"	
			});
			document.getElementById("image").src="../../../../Public/libs/nianhui1/image/kaishi.png";
			var oAudio = document.getElementById('audio');
            oAudio.pause();
            // getcustomerlist();        
        });

        $("#yaoyiyaobtn").click(function () {
            $("#qiandaoqiang").hide();
            $("#choujiang").hide();
            $("#yaoyiyao").show();
            $("#shuanjian").hide();
            $(".ystop").show();
            $(".cstart").hide();
            $(".yaoyiyaodiv").show();
            $(".ybgdiv").show();
            $("#svg").hide();
            $("#djsfont").hide();
            $(".lingjiang").hide();
            var oAudio = document.getElementById('audio');
            oAudio.pause();
            //          $(".centerimg").hide();


        });


        // 获取活动状态
        var active_flag = 0;
        var activeId = 0;
        $.ajax({
            type: 'POST',
            url: '/admin.php/Active/getsharkflag',
            data: {
                'time': Date.parse(new Date())
            },
            success: function (data) {
                if (data['return_code'] == 1) {
                    active_flag = data['return_body']['activity_flag'];
                    if (active_flag == 0) {
                        $('.change-shark-flag-btn').html('开始');
                    } else {
                        activeId = data['return_body']['id'];
                        $('.change-shark-flag-btn').html('关闭');
                    }
                }
            },
            error: function (err) {
                console.log(err);
            }
        })

        // 修改活动标识
        $('.change-shark-flag-btn').on('touch click', function () {

            $('.change-shark-flag-btn').attr('disabled', true);
            $('#yaoyiyaobtn').attr('disabled', true);

            if (active_flag == 0) {
                active_flag = 1;
            } else {
                active_flag = 0;
            }

            $.ajax({
                type: 'POST',
                url: '/admin.php/Active/changesharkflag',
                data: {
                    'flag': active_flag
                },
                success: function (data) {
                    if (data['return_code'] == 1) {
                        active_flag = data['return_body']['activity_flag'];
                        if (active_flag == 0) {
                            $('.change-shark-flag-btn').html('开始');
                            getList(activeId);
                        } else {
                            activeId = data['return_body']['id'];
                            $('.change-shark-flag-btn').html('关闭');
                            $('.change-shark-flag-btn').removeAttr('disabled');
                            $('#yaoyiyaobtn').removeAttr('disabled');
                            $("#yaoyiyaobtn").trigger('click');
                        }
                    }
                },
                error: function (err) {
                    console.log(err);
                }
            })
        })



        $("#shuanjianbtn").click(function () {
            $("#qiandaoqiang").hide();
            $("#choujiang").hide();
            $("#yaoyiyao").hide();
            $("#shuanjian").show();
            $(".ystop").hide();
            $(".cstart").hide();
            $(".centerimg").show();
        });


        function getList(activeId) {
            $(".ybgdiv").hide();
            $("#svg").show();
            $("#djsfont").show();
            setTimeout(function () { //10秒后隐藏
                $(".yaoyiyaodiv").hide();
                $(".lingjiang").show();
                //              $(".centerimg").show();

                // 定义模版引擎
                $.views.settings.delimiters("<%", "%>");
                $.ajax({
                    type: 'POST',
                    url: '/admin.php/Active/getusersharklist',
                    data: {
                        activeId: activeId,
                        isRecord: 1
                    },
                    success: function (data) {
                        $('.change-shark-flag-btn').removeAttr('disabled');
                        $('#yaoyiyaobtn').removeAttr('disabled');
                        if (data['return_code'] == 1) {
                            if(data['return_body'].length>0){
                                jsRenderTpl = $.templates('#j-specCard');
                                finalTpl = jsRenderTpl(data);
                                $('.j-specCard-box').html(finalTpl);
                            }else{
                                $('.j-specCard-box').html('<div class="lingjiantai"></div>');
                                alert('没有用户摇');
                            }
                            
                        } else {
                            alert(data['return_msg']);
                        }
                    },
                    error: function (err) {
                        console.log(err);
                    }
                })
            }, 10000);
        }


        $(".jieshu-yaoyiyao").click(function () {
            $(".ybgdiv").hide();
            $("#svg").show();
            $("#djsfont").show();
            setTimeout(function () { //10秒后隐藏
                $(".yaoyiyaodiv").hide();
                $(".lingjiang").show();
                //              $(".centerimg").show();

            }, 10000);
        })

        //      function clock() {
        //          setTimeout(function () { //1秒后隐藏
        //              var t = "/Public/libs/nianhui1/img/2.png";
        //              document.getElementById("dengimg").src = t
        //              timedCount();
        //          }, 500);
        //      }
        //
        //      function timedCount() {
        //          setTimeout(function () { //1秒后隐藏
        //              var t = "/Public/libs/nianhui1/img/1.png";
        //              document.getElementById("dengimg").src = t
        //              clock();
        //          }, 500);
        //      }

        // 获取抽奖用户的列表
        // function getcustomerlist() {
        //     $.ajax({
        //         type: 'POST',
        //         url: '/admin.php/Active/getcustomerlist',
        //         data: {
        //             time: 666
        //         },
        //         success: function (data) {
        //             console.log(data);
        //             if(data['return_code']==1){
        //                 if(data['return_body'].length>0){
        //                     $.allUser=data['return_body'];
        //                 }else{
        //                     alert('现在还没有抽奖用户呢');
        //                 }
        //             }else{
        //                 console.log(data['return_msg']);
        //             }
        //         },
        //         error: function (err) {

        //         }
        //     })
        // }
    </script>

</body>

<!-- goeasy -->
<script type="text/javascript" src="https://cdn-hangzhou.goeasy.io/goeasy.js"></script>
<script type="text/javascript">
    var goEasy = new GoEasy({
        appkey: 'BS-009cd1c132ff41daa014c5157935997c'
    });
    goEasy.subscribe({
        channel: 'check_user_login',
        onMessage: function (message) {
            var contentObj = jQuery.parseJSON(message.content);
            // console.log(contentObj);

            // $.pushMsgHandle(contentObj);

            $.pushUserArr.push(contentObj);


            if(!$.allUser){
                $.allUser=[];
            }
			for(var a=0;a<$.allUser.length;a++){
                if(contentObj['user_openid']!=$.allUser[a]['user_openid']){
                    $.allUser.push(contentObj);
                }
            }

            


        }
    });
    goEasy.subscribe({
        channel: 'check_user_uploadimg',
        onMessage: function (message) {
            var contentObj = jQuery.parseJSON(message.content);
            picList.push({
                width: 700,
                height: 400,
                content: 'http://wx.lovepai.ren' + contentObj['img_url']
            })
        }
    });

    // 定时检查是否有用户签到
    $.pushUserArr = [];
    setInterval(function () {
        if ($.pushUserArr.length > 0) {
            var contentSubObj = $.pushUserArr.shift();
            $.pushMsgHandle(contentSubObj);
        } else {
            return '没有用户';
        }
    }, 6000);
</script>

</html>